<!-- vis type specific options -->

<div class="kuiSideBarSection">
  <div class="form-group">
    <label for="coordinateMapOptionsMapType">Map type</label>
      <select
        id="coordinateMapOptionsMapType"
        name="agg"
      class="form-control"
      ng-model="vis.params.mapType"
      ng-init="vis.params.mapType || vis.type.editorConfig.collections.mapTypes[0]"
      ng-options="mapType as mapType for mapType in vis.type.editorConfig.collections.mapTypes"
      >
    </select>
  </div>

  <div ng-if="vis.params.mapType === 'Heatmap'" class="form-group">
    <div>
      <label>
        Cluster size
      </label>
      <div class="vis-editor-agg-form-row">
        <input
          name="heatClusterSize"
          ng-model="vis.params.heatClusterSize"
          required
          class="form-control"
          type="range"
          min="1.0"
          max="3.0"
          step="0.1"
          >
        <div class="vis-editor-agg-form-value">
          {{vis.params.heatClusterSize}}
        </div>
      </div>
    </div>

  </div>

  <vislib-basic-options></vislib-basic-options>

  <div class="vis-option-item form-group">
    <label>
      <input type="checkbox"
      name="isDesaturated"
      ng-disabled="!vis.type.visConfig.canDesaturate"
      ng-model="vis.params.isDesaturated">

      Desaturate map tiles

      <kbn-info info="Reduce the vibrancy of tile colors, this does not work in any version of Internet Explorer"></kbn-info>
    </label>
  </div>

  <div class="vis-option-item form-group">
    <label>
      <input type="checkbox"
      name="wms.enabled"
      ng-model="vis.params.wms.enabled">

      WMS compliant map server

      <kbn-info info="Use WMS compliant map tile server. For advanced users only."></kbn-info>
    </label>
  </div>

  <div ng-show="vis.params.wms.enabled" class="well">
    <div class="vis-option-item form-group">
        <p>WMS is an OGC standard for map image services. For more information, go <a href="http://www.opengeospatial.org/standards/wms">here</a>.</p>
        <label>
          WMS url* <kbn-info info="The URL of the WMS web service."></kbn-info>
        </label>
      <input type="text" class="form-control"
        name="wms.url"
        ng-model="vis.params.wms.url">
    </div>

    <div class="vis-option-item form-group">
      <label>
        WMS layers* <kbn-info info="A comma seperated list of layers to use."></kbn-info>
      </label>
      <input type="text" class="form-control"
        ng-require="vis.params.wms.enabled"
        ng-model="vis.params.wms.options.layers"
        name="wms.options.layers">
    </div>

    <div class="vis-option-item form-group">
      <label>
        WMS version* <kbn-info info="The version of WMS the server supports"></kbn-info>
      </label>
      <input type="text" class="form-control"
        name="wms.options.version"
        ng-model="vis.params.wms.options.version">
    </div>

    <div class="vis-option-item form-group">
      <label>
        WMS format* <kbn-info info="Usually image/png or image/jpeg. Use png if the server will return transparent layers."></kbn-info>
      </label>
      <input type="text" class="form-control"
        name="wms.options.format"
        ng-model="vis.params.wms.options.format">
    </div>

    <div class="vis-option-item form-group">
      <label>
        WMS attribution <kbn-info info="Attribution string for the lower right corner."></kbn-info>
      </label>
      <input type="text" class="form-control"
        name="wms.options.attribution"
        ng-model="vis.params.wms.options.attribution">
    </div>

    <div class="vis-option-item form-group">
      <label>
        WMS styles* <kbn-info info="A comma seperated list of WMS server supported styles to use. Blank in most cases."></kbn-info>
      </label>
      <input type="text" class="form-control"
        name="wms.options.styles"
        ng-model="vis.params.wms.options.styles">
    </div>

    <p>* if this parameter is incorrect, maps will fail to load.</p>


  </div>
</div>
